<template>

  <div ref="transferBoxMain">
    <div class="title">
      <span class="line"></span>
      <span><i class="el-icon-sort"></i> 转账记录</span>
      <!-- <el-button
        style="
          float: right;
          margin-left: 10px;
          margin-right: 10px;
          margin-top: 6px;
          color: #fff;
        "
        type="text"
        @click="exportExcel"
        >导出Excel</el-button> -->
        <!-- footer="RXRXXRXRX" -->
              <download-excel
                class="export-excel-wrapper"
                :data="DetailsForm"
                :fields="json_fields"
                :header="title"
                style="display: inline-block;float: right;margin-right: 20px;"
                :name="`微信转账记录.xls`"
              >
              <!-- 上面可以自定义自己的样式，还可以引用其他组件button -->
              <el-button type="text" style="color: #fff;" @click="exportExcel">导出Excel</el-button>
              </download-excel>
    </div>
    <a-input-search
      v-model="searchkey"
      placeholder="输入关键词搜索"
      style="width: 430px;margin-left:10px;margin-bottom:10px;"
      @search="init"
    />
    <div class="transferClass" @scroll="handleScroll" ref="list">
      <div class="itemTrans" @click.stop="jumpOrderPosition(item)" v-for="(item,index) in tableData" :key="index" title="点击定位到聊天">
        <div v-if="item.issend==1">
                <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==8" class="hongbaotext">
                  <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt=""> -->
                  <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                  <div style="width:300px;margin-right:15px;">
                  <span style="font-weight:1000;">
                    <span v-if="item.sendernick">{{item.sendernick}}</span>
                    <span v-else>{{item.sendername}}</span>
                    </span>
                  转账
                  <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>
                  元给 <span style="font-weight:1000;">{{item.contactnick}}</span> <span v-if="item.contactname">({{item.contactname}})</span>
                </div>
                </div>
                <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==4" class="hongbaotext">
                  <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                  <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt=""> -->
                  <div style="width:300px;margin-right:15px;">
                  <span style="font-weight:1000;">
                  <span v-if="item.sendernick">{{item.sendernick}}</span>
                    <span v-else>{{item.sendername}}</span>
                  </span>
                  已退还 <span style="font-weight:1000;">{{item.contactnick}}</span> <span v-if="item.contactname">({{item.contactname}})</span>的转账
                  <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
                </div>
                </div>
                <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==3" class="hongbaotext">
                  <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (1).png" width="50px" height="50px" alt=""> -->
                  <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                  <div style="width:300px;margin-right:15px;">
                  <span style="font-weight:1000;">
                  <span v-if="item.sendernick">{{item.sendernick}}</span>
                    <span v-else>{{item.sendername}}</span>
                  </span>
                  收到 <span style="font-weight:1000;">{{item.contactnick}}</span> <span v-if="item.contactname">({{item.contactname}})</span>转账
                  <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
                </div>
                </div>
                <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==9" class="hongbaotext">
                  <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt=""> -->
                  <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                  <div style="width:300px;margin-right:15px;">
                  <span style="font-weight:1000;">
                  <span v-if="item.sendernick">{{item.sendernick}}</span>
                    <span v-else>{{item.sendername}}</span>
                  </span>
                  已被退还
                  <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
                </div>
                </div>
                <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==1" class="hongbaotext">
                  <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt=""> -->
                  <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                  <div style="width:300px;margin-right:15px;">
                  <span style="font-weight:1000;">{{item.sendername}}</span>
                  转账
                  <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元给  <span style="font-weight:1000;">{{item.contactnick}}</span> <span  v-if="item.contactname">({{item.contactname}})</span>
                </div>
                </div>
                <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==10" class="hongbaotext">
                  <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                  <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt=""> -->
                  <div style="width:300px;margin-right:15px;">
                  <span style="font-weight:1000;">
                      <span v-if="item.sendernick">{{item.sendernick}}</span>
                    <span v-else>{{item.sendername}}</span>
                  </span>
                  已被{{item.contactnick}} <span v-if="item.contactname">({{item.contactname}})</span>退还转账
                  <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
                </div>
                </div>
          </div>

          <div v-else>
            <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==8" class="hongbaotext">
              <div style="width:300px;margin-right:15px;">
                <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
                <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt=""> -->
                <span style="font-weight:1000;">
                  <span v-if="item.contactnick">{{item.contactnick}}</span>
                  <span v-else>{{item.contactname}}</span>
                  </span>
                转账
                <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>
                元给 <span style="font-weight:1000;">{{label}}</span>
              </div>
          </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==4" class="hongbaotext">
            <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt=""> -->
            <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
            <div style="width:300px;margin-right:15px;">
            <span style="font-weight:1000;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            已退还 <span style="font-weight:1000;">{{label}}</span>的转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
          </div>
          </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==3" class="hongbaotext">
            <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (1).png" width="50px" height="50px" alt=""> -->
            <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
            <div style="width:300px;margin-right:15px;">
            <span style="font-weight:1000;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            收到 <span style="font-weight:1000;">{{label}}</span>转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
          </div>
          </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==9" class="hongbaotext">
            <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
            <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt=""> -->
            <!-- <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt=""> -->
            <div style="width:300px;margin-right:15px;">
            <span style="font-weight:1000;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            已被退还
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
          </div>
          </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==1" class="hongbaotext">
            <!-- <img style="margin-right:20px;" src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt=""> -->
            <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
            <div style="width:300px;margin-right:15px;">
            <span style="font-weight:1000;">{{item.sendername}}</span>
            转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元给  <span style="font-weight:1000;">{{label}}</span>
          </div>
          </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==10" class="hongbaotext">
            <!-- <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt=""> -->
            <img style="margin-right:20px;" v-lazy-img="item.contactavatar?item.contactavatar:wxLogoSrc" width="50px" height="50px" alt="">
            <div style="width:300px;margin-right:15px;">
              <span style="font-weight:1000;">
                  <span v-if="item.contactnick">{{item.contactnick}}</span>
                <span v-else>{{item.contactname}}</span>
              </span>
              已被<span style="font-weight:1000;">{{label}}</span>退还转账
              <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元
            </div>
          </div>
          </div>
        <div class="timeBox">{{ formateDate(item.msgtime) }}</div>
      </div>
      <div class="loadingBox" v-if="showLoading" style="color:#2196f3;margin-top:20px;"><i :class="loadClass" style="color:#2196f3"></i> {{ loadingText }}</div>
    </div>
    <!-- <el-table border height="630" stripe :data="tableData" style="width: 100%">
      <el-table-column prop="date" label="详情" width="300" >
        <template slot-scope="scope">
          <div v-if="item.issend==1">
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==8">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
              <span v-if="item.sendernick">{{item.sendernick}}</span>
              <span v-else>{{item.sendername}}</span>
              </span>
            转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>
            元给 <span style="font-weight:1000;">{{item.contactnick}}</span> <span v-if="item.contactname">({{item.contactname}})</span></div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==4" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
            <span v-if="item.sendernick">{{item.sendernick}}</span>
              <span v-else>{{item.sendername}}</span>
            </span>
            已退还 <span style="font-weight:1000;">{{item.contactnick}}</span> <span v-if="item.contactname">({{item.contactname}})</span>的转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元</div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==3" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (1).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
            <span v-if="item.sendernick">{{item.sendernick}}</span>
              <span v-else>{{item.sendername}}</span>
            </span>
            收到 <span style="font-weight:1000;">{{item.contactnick}}</span> <span v-if="item.contactname">({{item.contactname}})</span>转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元 </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==9" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
            <span v-if="item.sendernick">{{item.sendernick}}</span>
              <span v-else>{{item.sendername}}</span>
            </span>
            已被退还
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元</div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==1" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">{{item.sendername}}</span>
            转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元给  <span style="font-weight:1000;">{{item.contactnick}}</span> <span  v-if="item.contactname">({{item.contactname}})</span></div>

          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==10" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
                <span v-if="item.sendernick">{{item.sendernick}}</span>
              <span v-else>{{item.sendername}}</span>
            </span>
            已被{{item.contactnick}} <span v-if="item.contactname">({{item.contactname}})</span>退还转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元</div>
          </div>

          <div v-else>
            <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==8">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
              </span>
            转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>
            元给 <span style="font-weight:1000;">{{label}}</span></div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==4" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            已退还 <span style="font-weight:1000;">{{label}}</span>的转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元</div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==3" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (1).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            收到 <span style="font-weight:1000;">{{label}}</span>转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元 </div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==9" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
              <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            已被退还
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元</div>
          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==1" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (3).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">{{item.sendername}}</span>
            转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元给  <span style="font-weight:1000;">{{label}}</span></div>

          <div v-if="formateCard(item).msg.appmsg.wcpayinfo.paysubtype==10" class="hongbaotext">
            <img src="../../../assets/images/weChatQQ/zhuanzhanglist (2).png" width="50px" height="50px" alt="">
            <span style="font-weight:1000;margin-left:15px;">
                            <span v-if="item.contactnick">{{item.contactnick}}</span>
              <span v-else>{{item.contactname}}</span>
            </span>
            已被<span style="font-weight:1000;">{{label}}</span>退还转账
            <span style="font-weight:1000;color:red;">{{formateCard(item).msg.appmsg.wcpayinfo.feedesc}}</span>元</div>
          </div>

        </template>
      </el-table-column>
      <el-table-column prop="name" label="时间" align="center">
        <template slot-scope="scope">
          {{formateDate(item.msgtime)}}
        </template>
      </el-table-column>
      <el-table-column prop="address" label="转账备注" align="center">
        <template slot-scope="scope">
          {{formateCard(item).msg.appmsg.wcpayinfo.pay_memo?formateCard(item).msg.appmsg.wcpayinfo.pay_memo:'-'}}
        </template> </el-table-column>

        <el-table-column label="操作" >
          <template slot-scope="scope">
            <div class="badgeBox" v-if="item.cntRemark>0">{{$t('wechat.remarked')}}</div>
            <el-button class="orderBtn" :title="$t('wechat.biaojitishi')" v-else @click="markOrder(item)"  size="mini" style="margin-right:20px;float:right;color: #000;" icon="el-icon-edit">{{$t('wechat.biaoji')}}</el-button>
          </template>
        </el-table-column>
    </el-table> -->

    <!-- <div class="block">
      <el-pagination
        :hide-on-single-page="total < limit"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="offset"
        :page-sizes="[20, 30, 40, 50]"
        :page-size="limit"
        layout="total, sizes, prev, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div> -->

    <a-modal width="300px" v-model="showRemark" :getContainer="getRefsAff"
      :maskClosable="false" title="提示" @ok="handleOk">
      <p>{{$t('wechat.biaojibeizhu')}}</p>
      <p><el-input type="textarea" v-model="remark"></el-input></p>
    </a-modal>
  </div>
</template>
<script>
import { getTransfer,getExcelListApi } from "@/api/transfer/transfer_api";
import { parseTime } from "@/utils/index";
import { sendMarkOrderApi } from '@/api/markApi/index'
import { throttle } from 'lodash';
const x2js=require('x2js');
const x2jsone=new x2js(); //实例
export default {
  name: "transfer1",
  props: ["sendData"],
  data() {
    return {
    wxLogoSrc:require('../../../assets/login-02.png'),
    title: "转账记录",
    json_fields: {
            "时间":'time',
            "交易类型":'model',
            "交易对象":'receiveWxId',
            "详情":'des',
            "金额":'fee',
          },
    DetailsForm: [
    
       
      ],
      scrollTopData:0,
      loadClass:'el-icon-loading',
      loadingText:'正在加载. . .',
      showLoading:false,
      showPrint:false,
      showRemark:false,
      remark:'',
      id:'',
      headerTitle: [],
      tableData: [],
      offset: 1,
      limit: 20,
      total: 0,
      searchkey:'',
      label:'',
      avatarSrc:''
    };
  },
  watch: {
    "$store.state.account.transfer1": function () {
      if(this.sendData.list_offset){
        this.offset=1;
        this.limit=20*this.sendData.list_offset;
      }else{
        this.offset=1
      }

      this.label=sessionStorage.getItem('label')
      this.init();
    },
  },
  created() {
    if(this.sendData.list_offset){
      this.offset=1;
      this.limit=20*this.sendData.list_offset;
    }else{
      this.offset=1
    }
    this.init();
    this.avatarSrc = sessionStorage.getItem('userAvatar');
  },
  methods: {

    exportExcel(){

      // console.log(this.sendData)
        let data = {
          proof_num:this.sendData.proof_num,
          account_id:this.sendData.account_id,
          searchkey:'',
          model:'transfer',
          offset:1,
          limit:10000
        }
       getExcelListApi(data).then(res=>{
       
          
        }).catch(error=>{

        })
    },
    jumpOrderPosition(item){

        // item['proof_num'] = this.sendData.proof_num;
        // item['username'] = sessionStorage.getItem('usernameTitle');
        // item['model'] = 'wechat';
        // item['msgtime'] = item.msgtime;
        // item['contact_username'] = item.contactname;
        // item['id'] = item.id;
        // item['list_offset'] = 1;
        // item['msg_offset'] = 1;
        // item['app_name'] = item.contactname.includes('@')?'群组':'好友';

        item['proof_num'] = this.sendData.proof_num;
        item['username'] = sessionStorage.getItem('usernameTitle');
        item['model'] = 'transfer';
        item['msgtime'] = item.msgtime;
        item['contact_username'] = item.contactname;
        item['id'] = item.id;
        item['list_offset'] = this.offset;
        // item['list_offset'] = this.sendData.list_offset?this.sendData.list_offset:this.offset;
        item['msg_offset'] = 1;
        item['app_name'] = item.contactname.includes('@')?'群组':'好友';
        item['wxChildrenNode'] = true;
        item['scrollTop'] = this.scrollTopData;
        item['childrenModel'] = 'transfer';
        item['account_id'] = this.sendData.account_id;

        // 储存类型
        sessionStorage.setItem('model',"wechat")
        // 储存节点数据
        sessionStorage.setItem('sumData',JSON.stringify(item))
        // 激活跳转组件
        this.$store.commit('SET_ORDERDATA',Date.parse(new Date()))
        sessionStorage.setItem('only',true);
    },
    handleScroll:throttle(function(){
      const list = this.$refs.list;
      this.scrollTopData = list.scrollTop;

      // 判断滚动到底部
      if (list.scrollTop + list.clientHeight+10+10 >= list.scrollHeight) {
        this.showLoading=true;

        if(this.tableData.length<this.total){
          this.loadClass = 'el-icon-loading';
          this.loadingText = '正在加载. . .';
          this.offset++;
          // 加载更多数据
          let that = this;
            that.initTransfer();
        }else{
          this.loadClass = 'el-icon-success';
          this.loadingText = '到底了，没有更多了！';
        }
      }
    }),
    getRefsAff(){
      return  this.$refs.transferBoxMain;
    },
    handleOk(){
        let data={
        navigation_list:sessionStorage.getItem('arr').split(','),
        model:this.sendData.model,
        isChat:0,
        app_name:'',
        account_id:this.sendData.account_id,
        proof_num:this.sendData.proof_num,
        list_offset:this.offset,
        list_limit:this.limit,
        remark:this.remark,
        class:this.sendData.class,
        label:this.sendData.label,
        id:Number(this.id)
      }
      sendMarkOrderApi(data).then(res=>{
        this.showRemark=false;
        this.$message({
          message: '标记数据成功！',
          type: 'success'
        });
        this.init()
      })
    },
    // 添加标记点
    markOrder(item){
      this.id=item.id;
      this.showRemark=true;
    },
        // 格式化xml
    formateCard(item){
        let xml=item.contant,
        xmlDo=x2jsone.xml2js(xml);
        return xmlDo
    },
    formateDate(date) {
      return parseTime(date);
    },
    init() {
      this.tableData = [];
      this.initTransfer();
    },
    initTransfer() {
      if(sessionStorage.getItem('searchAll')!==null){
            this.searchkey = sessionStorage.getItem('searchAll');
        }

      let data = {
        proof_num: this.sendData.proof_num,
        account_id: Number(this.sendData.account_id),
        searchkey:this.searchkey,
        model:this.sendData.model,
        offset:this.offset,
        limit:this.limit
      };
      getTransfer(data).then((res) => {
        if(res.data.length == 0){
          this.loadClass = 'el-icon-success';
          this.loadingText = '到底了，没有更多了！';
          return;
        }
        for (let index = 0; index < res.data.length; index++) {
          const element = res.data[index];
          this.tableData.push(element)
        }
        
        // this.tableData = res.data;
        this.total = res.data[0].cnt;

        if(this.sendData.list_offset){
          this.$nextTick(() => {
            this.$refs.list.scrollTop=this.sendData.scrollTop;
          })
          this.offset = this.sendData.list_offset
          this.limit = 20;
        }

        // 初始化excel
        for (let index = 0; index < res.data.length; index++) {
            const element = res.data[index];
            // console.log(element)

            let item = {}
            if(element.issend == 1){

              switch (element.xml_paysubtype) {
                case '1':
                case '8':
                  item = {
                    sendername: element.sendername+'-'+element.sendernick,
                    type:element.xml_title,
                    model:'转账',
                    receive: element.contactnick+'-'+element.membernick,
                    receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                    des:element.sendername+'-'+element.sendernick+' 转账给'+element.contactnick+'-'+element.membernick+element.xml_feedesc,
                    fee:element.xml_feedesc,
                    time:this.formateDate(element.msgtime)
                  }
                  break;
                case '3':
                  item = {
                    sendername: element.contactnick+'-'+element.membernick,
                    type:element.xml_title,
                    model:'转账',
                    receive: element.sendername+element.sendernick,
                    receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                    des:element.contactnick+' 转账'+element.xml_feedesc+'给'+element.sendername,
                    fee:element.xml_feedesc,
                    time:this.formateDate(element.msgtime)
                  }
                  break;
                case '4':
                  item = {
                    sendername: element.sendername+'-'+element.sendernick,
                    type:element.xml_title,
                    model:'退还',
                    receive: element.contactnick+'-'+element.membernick,
                    receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                    des:element.sendername+' 退还'+element.xml_feedesc+'给'+element.contactnick,
                    fee:element.xml_feedesc,
                    time:this.formateDate(element.msgtime)
                  }
                  break;
                case '9':
                case '10':
                  item = {
                    sendername: element.sendername+'-'+element.sendernick,
                    type:element.xml_title,
                    model:'被退还',
                    receive: element.contactnick+'-'+element.membernick,
                    receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                    des:element.sendername+' 被'+element.contactnick+'退还'+element.xml_feedesc,
                    fee:element.xml_feedesc,
                    time:this.formateDate(element.msgtime)
                  }
                  break;
              
                default:
                  break;
              }

            }else{

              switch (element.xml_paysubtype) {
                case '8':
                    item = {
                      sendername: element.contactnick,
                      type:element.xml_title,
                      model:'转账',
                      receive: element.sendername,
                      receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                      des:element.contactnick+' 转账'+element.xml_feedesc+'给'+this.label,
                      fee:element.xml_feedesc,
                      time:this.formateDate(element.msgtime)
                    }
                  break;
                case '4':
                case '9':
                    item = {
                      sendername: element.contactnick,
                      type:element.xml_title,
                      model:'退还',
                      receive: element.sendername,
                      receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                      des:element.contactnick+' 退还'+element.xml_feedesc+'给'+this.label,
                      fee:element.xml_feedesc,
                      time:this.formateDate(element.msgtime)
                    }
                  break;
                  
                case '3':
                    item = {
                      sendername: element.contactnick,
                      type:element.xml_title,
                      model:'转账',
                      receive: element.sendername,
                      receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                      des:element.contactnick+' 收到'+this.label+'转账'+element.xml_feedesc,
                      fee:element.xml_feedesc,
                      time:this.formateDate(element.msgtime)
                    }
                  break;
                  
                  case '1':
                      item = {
                        sendername: element.sendername,
                        type:element.xml_title,
                        model:'转账',
                        receive: this.label,
                        receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                        des:element.sendername+' 转账给'+this.label+element.xml_feedesc,
                        fee:element.xml_feedesc,
                        time:this.formateDate(element.msgtime)
                      }
                    break;
                    case '10':
                      item = {
                        sendername: this.label,
                        type:element.xml_title,
                        model:'转账',
                        receive: this.label,
                        receiveWxId: element.contactname+'-'+element.contactnick+'('+element.membernick+')',
                        des:this.label+' 退还给'+element.contactname+element.xml_feedesc,
                        fee:element.xml_feedesc,
                        time:this.formateDate(element.msgtime)
                      }
                    break;
              
                default:
                  break;
              }
            }
            this.DetailsForm.push(item)
           
          }
      });
    },
    handleSizeChange(val) {
      this.limit = val;
      this.init();
    },
    handleCurrentChange(val) {
      this.offset = val;
      this.init();
    },
    printPdf() {},
  },
};
</script>

<style scoped>
.loadingBox{
  width: 100%;
  text-align: center;
  margin-bottom:50px;
}
.timeBox{
  position: absolute;
  bottom: 0px;
  right: 10px;
}
.hongbaotext{
  display:flex;
  align-items: center;
}
.itemTrans{
  height: 90px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  border: 1px solid #ededed;
  position: relative;
  cursor: pointer;
}
.itemTrans:hover{
  background: #e4e4e4;
}
.transferClass{
  height: 90%;
  overflow-y: auto;
}
.transferClass::-webkit-scrollbar {
  width: 10px;
}
/* <!--修改 滚动条的 下面 的 样式--> */
.transferClass::-webkit-scrollbar-track {
  background-color: rgb(252, 252, 252);
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  border-radius: 2em;
}
/* <!--修改 滑块 --> */
.transferClass::-webkit-scrollbar-thumb {
  background-color: #c0c0c0;
  -webkit-border-radius: 2em;
  -moz-border-radius: 2em;
  border-radius: 2em;
}
  .badgeBox{
  width: 50px;
  height: 23px;
  border-radius: 10px;
  color: #fff;
  background: #f56c6c;
  text-align: center;
  line-height: 23px;
  font-size: 12px;
}
.aTag {
  text-decoration: underline;
  color: rgb(34, 109, 248);
}
.aTag:hover {
  color: #4f00a8;
}
.title {
  width: 100%;
  height: 50px;
  background: #2b2f3a;
  margin-bottom: 20px;
  font-size: 0.1rem;
  line-height: 50px;
  padding-left: 20px;
  color: #fff;
}
.line {
  width: 8px;
  height: 100%;
}
</style>
